<template>
  <view class="card" @click="clickHandle">
    <view class="card_header">
      <slot name="header"><text>我的卡片</text></slot>
    </view>
    <view class="card_body">
      <slot></slot>
    </view>
  </view>
</template>
<script>
export default {
  name: "card",
  methods:{
    clickHandle(){
      this.$emit('clickHandle')
    }
  }
};
</script>
<style lang="scss">
.card {
  border-radius: 8rpx;
  border: 1px solid #ebeef5;
  background-color: #fff;
  overflow: hidden;
  color: #303133;
  transition: 0.3s;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  margin-bottom: 20rpx;
  .card_header {
    color: #0f0f0f;
    padding: 30rpx 34rpx;
    border-bottom: 1px solid #ebeef5;
    box-sizing: border-box;
  }
  .card_body {
    position: relative;
  }
}
</style>